/* 
  各类模型 相关 css 配置
*/
*{
  margin:0 auto;
  padding:0;
}
html,body{
  height:100%;
}

body{
  min-width:1000px;
  background: linear-gradient(skyblue,khaki);
  overflow: hidden;
}
#left{
  width:200px;
  height:100%;
  overflow:hidden;
}
#right{
  width:200px;
  height:100%; 
  right:0;
  overflow:hidden;
}
.r_area{
  position:relative;
  margin-top:24px;
  width:192px;
  height:800px;
  border-radius:8px;
  background:rgb(205,205,245);
}
.r_area:nth-child(1)::before{
    display:block;
    position:absolute;
    top:-20px;
    font-size:12px;
    content:'模型数据';
}
.r_area:nth-child(2)::before{
  display:block;
  position:absolute;
  top:-20px;
  font-size:12px;
  content:'模型面组件';
}
/* .r_area:nth-child(3)::before{
  display:block;
  position:absolute;
  top:-20px;
  font-size:12px;
  content:'模型面组件-child1';
} */
/* 右侧列表容器 和 选项部分 */
.r_rq{
   width:100%;
   height:100%;
   overflow-x:hidden;
   overflow-y:auto;
}
.r_list{
   margin-top:4px;
   width:100%;
   height:20px;
   line-height:20px;
   background:rgb(120,212,255);
}
.r_list:hover{
   cursor:pointer;
   background:rgb(247,180,173);
}
.r_list *{
   float:left;
   display:inline-block;
   margin-top:0;
   margin-left:4px;
   font-size:12px;
   font-weight:bolder;
}
/* 底部 */
#bottom{
  width:100%;
  height:160px;
  bottom:0;
  overflow:hidden;
  /* padding-left:200px; */
  /* margin-left:-200px; */
}
/* 底部参数区域 */
.b_area{
   width:99%;
   height:152px;
   margin-top:4px;
   padding-left:200px;
   /* border:1px solid red; */
}
/* 每种对应参数区域  模型 或 组件 */
.b_cfg{
   margin-left:0;
   width:100%;
   height:100%;
   /* border:1px solid red; */
}
.b_cfg *{
    float:left;
    display:inline-block;
    font-size:12px;
    /* font-weight:bolder; */
    margin-top:2px;
    margin-left:12px;
    height:20px;
    line-height:20px;
    
}
.b_cfg input{
    margin-left:4px;
    height:16px;
    background-repeat: ;
}
.b_cfg button{
    padding-left:4px;
    padding-right:4px;
    color:red;
}
.b_cfg .b_c_rq{
   margin-top:0;
   margin-left:0;
   height:auto;
}

.bar0{
  position:absolute;
  background:rgb(200,200,200);
  z-index:2;
}
.bar1{
  position:absolute;
  background:rgb(211,214,215);
  z-index:1;
}
.list{
 width:100%;
 margin-top:20px;
 background:rgb(153,153,156);
 border-radius:6px;
}
.title{
  position:relative;
  width:100%;
  height:20px;
  line-height:20px;
  font-size:12px;
  font-weight:bolder;
  color:blue;
  background:rgb(183,191,252);
  padding-left:12px;
  cursor: pointer;
}
.arrow0{
   position:absolute;
   right:20px;
   top:2px;
   margin-left:10px;
   width:20px;
   height:16px;
   background-image: url(../img/0.png);
   background-size:20px 16px;
}
.arrow1{
  position:absolute;
  right:20px;
  top:2px;
  margin-left:10px;
  width:20px;
  height:16px;
  background-image: url(../img/0.png);
  background-size:20px 16px;
}

.cfg_area{
  padding-top:8px;
  padding-bottom:8px;
  font-weight:bolder;
  font-size:12px;
}
.cfg_area *{
  /*  display:inline-block;
   float:left;
   margin-top:4px;
   margin-left:10px;
   height:18px;
   line-height:18px;
   font-weight:bolder;
   font-size:12px;
   padding-left:3px;
   padding-right:3px; */
}
.table{
  display:block;
  width:90%;
}
.table tr{
  width:100%;
  height:18px;
  line-height:18px;
}
.table td{
  width:100%;
  height:18px;
  line-height:18px;
  text-align:left;
  /* text-overflow: ellipsis; */
}

.table button{
  font-weight:bolder;
  font-size:12px;
  padding-left:3px;
  padding-right:3px;
  width:80px;
  height:18px;
  white-space:nowrap; 
  overflow: hidden;
  text-overflow: ellipsis;
}

.cfg_area::after{
   display:block;
   content:'';
   clear: both;
   width:100%;
   height:1px;
}


/* 浮动在最上层的 编辑区 */
#widget{
  display:none;
  position:absolute;
  width:600px;
  height:500px;
  left:50%;
  top:50%;
  margin-left:-300px;
  margin-top:-200px;
  background: linear-gradient(rgb(182,183,253),rgb(84,87,253));
  border:1px solid red;
  border-radius:10px;
  z-index:9;
}
/* 模型展示区 */
#model{
  display:none;
  position:absolute;
  width:100%;
  height:400px;
  pointer-events:none;
  /* overflow-x:hidden; */
  /* overflow-y:auto; */
}

/* 组件展示区 */
#component{
  position:absolute;
  width:100%;
  height:400px;
  overflow-x:hidden;
  overflow-y:auto;
}
#component .parts{
   display:inline-block;
   float: left;
   margin-left:18px;
   margin-top:12px;
}
#component .parts:hover{
    transform:scale3d(1.1,1.1,1.1) ;
}
/* 用于 添加时 调整 参数    */
#parameter{
  position:absolute;
  bottom:0;
  width:100%;
  height:100px;
  border-radius:10px;
  background:rgb(227,227,230);
}
#parameter *{
   display:inline-block;
   height:20px;
   line-height:20px;
   font-size:12px;
   font-weight:bolder;
}
#parameter button{
    float:left;
    margin-left:8px;
    margin-top:6px;
    width:40px;
}
#parameter span{
    float:left;
    width:fit-content !important;
    margin-left:8px;
    margin-top:6px;
    width:40px;
  
}
#parameter input{
  float:left;
  margin-left:3px;
  margin-top:6px;
  width:40px;
  height:18px;
  top:2px;
  
}
/* 最最上层的提示区域 */
#tip{
   display:none;
   position:fixed;
   right:2px;
   bottom:2px;
   width:300px;
   height:200px;
   z-index:999;
   background:rgb(228,230,245);
   font-size:12px;
   font-weight:bolder;
   line-height:20px;
   overflow-x:hidden;
   overflow-y:auto;
   padding-left:8px;
   padding-right:8px;
   text-indent:30px;
   border:1px solid black; 
}